// 2. 引入并声明使用插件
import Vue from "vue";
import VueRouter from "vue-router";
import store from "../store";
import routes from "./routes";

// 2.注册路由组件
Vue.use(VueRouter);

//解决router的3.1.0版本的重复点击按钮报错的问题
// 原型上修改push方法
const originPush = VueRouter.prototype.push; // 先将之前的存储到一个变量当中
const originReplace = VueRouter.prototype.replace; // 同上

// 修改VueRouter原型上的push 用于解决重复跳转时报错的问题
VueRouter.prototype.push = function (location, okCallBack, errCallBack) {
  if (okCallBack === undefined && errCallBack === undefined) {
    // 上面的判断成立的话，表示没有传递这两个参数
    originPush.call(this, location).catch(() => {}); // 统一处理报错的问题 一劳永逸
  } else {
    originPush.call(this, location, okCallBack, errCallBack);
  }
};

// 修改VueRouter原型上的replace 用于解决重复跳转时报错的问题
VueRouter.prototype.replace = function (location, okCallBack, errCallBack) {
  if (okCallBack === undefined && errCallBack === undefined) {
    // 上面的判断成立的话，表示没有传递这两个参数
    originReplace.call(this, location).catch(() => {}); // 统一处理报错的问题 一劳永逸
  } else {
    originReplace.call(this, location, okCallBack, errCallBack);
  }
};

// 3. 创建路由实例并添加路由规则
const router = new VueRouter({
  mode: "history", // 设置路由模式  不要#
  routes,
  //切换到新的路由的时候 期望滚动到的位置
  scrollBehavior(to, from, savedPosition) {
    //回到上一个页面 页面位置在顶部
    if (savedPosition) {
      return savedPosition;
    } else {
      return { x: 0, y: 0 };
    }
  },
});

// // 使用全局前置守卫
router.beforeEach(async (to, from, next) => {
  // to代表目的地的路由对象
  // from代表起始位置的路由对象
  // next是一个函数，主要用于拦截之后的处理
  // next()  代表无条件放行
  // next(false) 代表原地不动
  // next(path/路由对象) 代表跳转到指定的路由（位置）

  let token = store.state.user.token;
  let userInfo = store.state.user.userInfo;
  // 判断token是不是存在
  if (token) {
    // 代表token存在,代表登录过
    // 判断用户是不是还是去登录
    if (to.path === "/login") {
      // 代表用户已经登录又想去登录
      // 不能写false，写了false就卡那了，永远不可能拿到用户信息了
      // 写了路径，我们前置守卫就会再一次接入从头再来
      next("/");
    } else {
      // 如果人不是去登录，那么此时就要看用户信息在不在
      if (userInfo.name) {
        // 如果用户信息存在无条件放行
        next();
      } else {
        // 如果用户信息不存在，就发请求获取用户
        try {
          // 请求获取用户信息成功，用户信息会自动存在state里面
          // 无条件放行
          await store.dispatch("getUserInfo");
          // store.dispatch("getUserInfo")
          next("/Center");
        } catch (error) {
          // 请求获取用户信息失败，统一认为token过期
          // 我们要把原来的token删除,然后重新登录
          store.dispatch("userLogout");
          next("/login");
        }
      }
    }
  } else {
    // 代表没登录过
    // 如果用户没登录访问  交易相关  支付相关  用户中心相关，我们不能让他去
    // 应该让用户去登录
    let target = to.path;
    if (
      target.indexOf("/trade") === 0 ||
      target.indexOf("/pay") === 0 ||
      target.startsWith("/center")
    ) {
      next("/login?redirect=" + target);
    } else {
      next();
    }
  }
});
//导出路由实例
export default router;
